JavaScript Proxy Handler Validatsiyasi: Turga Xavfsiz Ob'ektni Tutish

JavaScript Proxies asosiy ob'ekt operatsiyalarini tutish va sozlash uchun kuchli mexanizmni ta'minlaydi. Eng jozibador foydalanish holatlaridan biri ma'lumotlarni validatsiya qilishdir. Proxy handlerlaridan foydalanib, siz ob'ekt xususiyatlariga cheklovlar va tur xavfsizligini qo'llashingiz mumkin, bu esa mustahkamroq va boshqarilishi osonroq kodga olib keladi. Ushbu blog posti JavaScript Proxies'dan samarali ob'ekt validatsiyasi uchun qanday foydalanishni o'rganadi, barcha darajadagi dasturchilar uchun amaliy misollar va ko'rsatmalar beradi. Biz turli handler usullarini ko'rib chiqamiz va ulardan ma'lumotlar yaxlitligini ta'minlash uchun qanday foydalanish mumkinligini ko'rsatamiz.

JavaScript Proxies'ni tushunish

Validatsiyaga sho'ng'ishdan oldin, JavaScript Proxies nima ekanligini va ular qanday ishlashini qisqacha ko'rib chiqaylik. Proxy ob'ekti boshqa ob'ektni (maqsadni) o'rab oladi va ushbu maqsad ustida bajariladigan operatsiyalarni tutib oladi. Proxy xususiyatni olish, xususiyatni o'rnatish, funksiyani chaqirish yoki yangi ob'ekt yaratish kabi operatsiyalar uchun maxsus xatti-harakatlarni belgilash imkonini beradi. Bu sozlash handler orqali amalga oshiriladi, bu maxsus operatsiyalarni tutib oladigan usullarni o'z ichiga olgan ob'ektdir.

Proxy yaratishning asosiy sintaksisi:

            const proxy = new Proxy(target, handler);
            

              
                Copy
              
            
          

• target: Proxy bilan o'raladigan ob'ekt.
• handler: Maqsad ustidagi operatsiyalarni tutib oladigan usullarni (tuzoqlarni) o'z ichiga olgan ob'ekt.

Validatsiya uchun Proxy Handler Usullari

Handler ob'ekti turli xil usullarni o'z ichiga olishi mumkin, ularning har biri maqsad ob'ekti ustidagi turli operatsiyaga mos keladi. Quyida validatsiya uchun eng muhim usullar keltirilgan:

• get(target, property, receiver): Xususiyatga kirishni tutib oladi.
• set(target, property, value, receiver): Xususiyatni tayinlashni tutib oladi.
• apply(target, thisArg, argumentsList): Funksiya chaqiruvlarini tutib oladi.
• construct(target, argumentsList, newTarget): new operatorini tutib oladi.
• deleteProperty(target, property): delete operatorini tutib oladi.
• defineProperty(target, property, descriptor): Xususiyat ta'rifini tutib oladi.
• has(target, property): in operatorini tutib oladi.
• ownKeys(target): Object.getOwnPropertyNames(), Object.getOwnPropertySymbols() va Reflect.ownKeys()'ni tutib oladi.
• preventExtensions(target): Object.preventExtensions()'ni tutib oladi.
• getPrototypeOf(target): Object.getPrototypeOf()'ni tutib oladi.
• setPrototypeOf(target, prototype): Object.setPrototypeOf()'ni tutib oladi.

Biz asosan get, set, apply va construct handlerlariga e'tibor qaratamiz, chunki ular validatsiya maqsadlarida eng ko'p qo'llaniladi.

set Handler yordamida Xususiyat Tayinlovlarini Validatsiya qilish

set handler xususiyat tayinlovlarini validatsiya qilish uchun juda muhimdir. U ob'ekt xususiyatlarini o'zgartirish urinishlarini tutib olish va tayinlash sodir bo'lishidan oldin cheklovlarni qo'llash imkonini beradi.

Misol: Tur tekshiruvi

Person ob'ektining xususiyatlari uchun tur tekshiruvini majbur qiluvchi Proxy yarataylik. Biz name har doim string va age har doim raqam bo'lishini ta'minlaymiz.

            const person = {
  name: 'John Doe',
  age: 30
};

const validator = {
  set: function(target, property, value) {
    if (property === 'name' && typeof value !== 'string') {
      throw new TypeError('Ism string bo\'lishi shart');
    }
    if (property === 'age' && typeof value !== 'number') {
      throw new TypeError('Yosh raqam bo\'lishi shart');
    }
    // Quyidagi qator xususiyatning haqiqatda o'rnatilishini ta'minlash uchun juda muhimdir.
    target[property] = value;
    return true; // Muvaffaqiyatni ko'rsatadi
  }
};

const proxy = new Proxy(person, validator);

proxy.name = 'Jane Smith'; // Muammosiz ishlaydi
proxy.age = 25; // Muammosiz ishlaydi

try {
  proxy.age = '40'; // TypeError yuzaga keltiradi
} catch (e) {
  console.error(e);
}

console.log(proxy.age); // Natija: 25

            

              
                Copy
              
            
          

Ushbu misolda, set handler name va age'ga tayinlanayotgan qiymatning turini tekshiradi. Agar tur noto'g'ri bo'lsa, u TypeError tashlaydi va tayinlashni oldini oladi. Qiymatni haqiqatda o'rnatish uchun handler ichida `target[property] = value;` qatorini kiritish juda muhimdir; aks holda, xususiyat yangilanmaydi.

Misol: Oraliqni Validatsiya qilish

Shuningdek, biz xususiyatning ma'lum bir oralig'ida ekanligini validatsiya qilishimiz mumkin. Masalan, age har doim 0 dan 120 gacha bo'lishini ta'minlaylik.

            const person = {
  name: 'John Doe',
  age: 30
};

const validator = {
  set: function(target, property, value) {
    if (property === 'age') {
      if (typeof value !== 'number') {
        throw new TypeError('Yosh raqam bo\'lishi shart');
      }
      if (value < 0 || value > 120) {
        throw new RangeError('Yosh 0 dan 120 gacha bo\'lishi shart');
      }
    }
    target[property] = value;
    return true;
  }
};

const proxy = new Proxy(person, validator);

proxy.age = 50; // Muammosiz ishlaydi

try {
  proxy.age = -5; // RangeError yuzaga keltiradi
} catch (e) {
  console.error(e);
}

            

              
                Copy
              
            
          

get Handler yordamida Xususiyatga Kirishni Validatsiya qilish

Qattiq validatsiya uchun kamroq qo'llanilsada, get handler xususiyatga kirilganda o'zgartirishlar yoki validatsiyalarni bajarish uchun ishlatilishi mumkin. Masalan, telefon raqamini formatlashingiz yoki sanani qaytarishdan oldin uning to'g'riligini ta'minlashingiz mumkin.

Misol: Faqat O'qishga mo'ljallangan Xususiyatlar

Siz to'g'ridan-to'g'ri o'qilmasligi kerak bo'lgan xususiyatga kirishga urinishda xato yuzaga keltirish orqali faqat o'qishga mo'ljallangan xususiyatlarni simulyatsiya qilishingiz mumkin.

            const config = {
  apiKey: 'secret_key'
};

const validator = {
  get: function(target, property) {
    if (property === 'apiKey') {
      throw new Error('apiKey\'ga to\'g\'ridan-to\'g\'ri kirish mumkin emas. Xavfsiz usuldan foydalaning.');
    }
    return target[property];
  }
};

const proxy = new Proxy(config, validator);

try {
  console.log(proxy.apiKey); // Error yuzaga keltiradi
} catch (e) {
  console.error(e);
}

            

              
                Copy
              
            
          

Bu yondashuv maxfiy ma'lumotlarga to'g'ridan-to'g'ri kirishni oldini oladi, dasturchilarni kalitni olish uchun ko'proq nazorat qilingan usuldan (masalan, autentifikatsiyani boshqaradigan funksiya) foydalanishga majbur qiladi.

apply Handler yordamida Funksiya Chaqiruvlarini Validatsiya qilish

apply handler funksiya chaqiruvlarini tutib olish va funksiyaga uzatilgan argumentlarni validatsiya qilish imkonini beradi. Bu funksiyalarning to'g'ri turdagi va sonli argumentlarni qabul qilishini ta'minlash uchun ayniqsa foydalidir.

Misol: Argument turini Validatsiya qilish

To'rtburchakning maydonini hisoblaydigan funksiyaga uzatilgan argumentlarni validatsiya qiluvchi Proxy yarataylik.

            function calculateArea(width, height) {
  return width * height;
}

const validator = {
  apply: function(target, thisArg, argumentsList) {
    if (argumentsList.length !== 2) {
      throw new Error('calculateArea aynan ikkita argumentni talab qiladi: width va height.');
    }

    const width = argumentsList[0];
    const height = argumentsList[1];

    if (typeof width !== 'number' || typeof height !== 'number') {
      throw new TypeError('Kenglik va balandlik raqam bo\'lishi shart.');
    }

    if (width <= 0 || height <= 0) {
      throw new RangeError('Kenglik va balandlik musbat qiymatlar bo\'lishi shart.');
    }

    return target.apply(thisArg, argumentsList);
  }
};

const proxy = new Proxy(calculateArea, validator);

console.log(proxy(5, 10)); // Natija: 50

try {
  console.log(proxy(5)); // Error yuzaga keltiradi
} catch (e) {
  console.error(e);
}

try {
  console.log(proxy('5', 10)); // TypeError yuzaga keltiradi
} catch (e) {
  console.error(e);
}

            

              
                Copy
              
            
          

Ushbu misolda, apply handler calculateArea funksiyasiga uzatilgan argumentlarning soni va turlarini tekshiradi. Agar argumentlar noto'g'ri bo'lsa, funksiya haqiqatda bajarilishidan oldin xato yuzaga keltiradi. Asosiy qator `return target.apply(thisArg, argumentsList);` asl funksiyani berilgan argumentlar bilan bajaradi.

construct Handler yordamida Ob'ekt Qurilishini Validatsiya qilish

construct handler new operatorini tutib olish va konstruktor funksiyasiga uzatilgan argumentlarni validatsiya qilish imkonini beradi. Bu konstruktorlar yordamida yaratilgan ob'ektlarga cheklovlarni qo'llash uchun ayniqsa foydalidir.

Misol: Talab qilinadigan Xususiyatlar

User ob'ekti har doim username va email bilan yaratilishini ta'minlaydigan Proxy yarataylik.

            class User {
  constructor(username, email) {
    this.username = username;
    this.email = email;
  }
}

const validator = {
  construct: function(target, argumentsList) {
    if (argumentsList.length !== 2) {
      throw new Error('User konstruktori ikkita argumentni talab qiladi: username va email.');
    }

    const username = argumentsList[0];
    const email = argumentsList[1];

    if (typeof username !== 'string' || username.length === 0) {
      throw new TypeError('Foydalanuvchi nomi bo\'sh bo\'lmagan string bo\'lishi shart.');
    }

    if (typeof email !== 'string' || !email.includes('@')) {
      throw new TypeError('Email manzil to\'g\'ri email manzil bo\'lishi shart.');
    }

    return new target(...argumentsList);
  }
};

const UserProxy = new Proxy(User, validator);

const user1 = new UserProxy('john.doe', 'john.doe@example.com'); // Muammosiz ishlaydi

try {
  const user2 = new UserProxy('john.doe'); // Error yuzaga keltiradi
} catch (e) {
  console.error(e);
}

try {
  const user3 = new UserProxy('john.doe', 'invalid_email'); // TypeError yuzaga keltiradi
} catch (e) {
  console.error(e);
}

console.log(user1);

            

              
                Copy
              
            
          

Ushbu misolda, construct handler User konstruktoriga uzatilgan argumentlarning soni va turlarini tekshiradi. Agar argumentlar noto'g'ri bo'lsa, ob'ekt yaratilishidan oldin xato yuzaga keltiradi. `return new target(...argumentsList);` qatori aslida berilgan argumentlar yordamida sinfning yangi nusxasini yaratadi.

Kengaytirilgan Validatsiya Texnikalari

Asosiy tur tekshiruvi va oraliq validatsiyasidan tashqari, Proxies yanada murakkab validatsiya stsenariylari uchun ishlatilishi mumkin.

Xususiyatlararo Validatsiya

Siz Proxies'dan turli xususiyatlar orasidagi bog'liqliklarni validatsiya qilish uchun foydalanishingiz mumkin. Masalan, boshlanish sanasi har doim tugash sanasidan oldin bo'lishini ta'minlashni xohlashingiz mumkin.

            const event = {
  startDate: '2024-01-15',
  endDate: '2024-01-20'
};

const validator = {
  set: function(target, property, value) {
    target[property] = value; // Qiymatni avval o'rnating

    if (property === 'endDate' && target.startDate > target.endDate) {
      throw new Error('Tugash sanasi boshlanish sanasidan keyin bo\'lishi shart.');
    }

    return true;
  }
};

const proxy = new Proxy(event, validator);

proxy.endDate = '2024-01-25'; // Muammosiz ishlaydi

try {
  proxy.endDate = '2024-01-10'; // Error yuzaga keltiradi
} catch (e) {
  console.error(e);
}

            

              
                Copy
              
            
          

Asinxron Validatsiya

Kamroq qo'llanilsada, siz Proxies'dan asinxron operatsiyalar bilan birgalikda yanada murakkab validatsiya stsenariylari uchun foydalanishingiz mumkin. Bu tashqi manbalarga qarshi ma'lumotlarni validatsiya qilish uchun API chaqiruvlarini amalga oshirishni o'z ichiga olishi mumkin.

Muhim Eslatma: Proxy handlerlari ichidagi asinxron operatsiyalar murakkab bo'lishi mumkin va event loopni bloklamaslik uchun ehtiyotkorlik bilan boshqarilishi kerak. Ko'pincha asinxron validatsiyani Proxy handleridan tashqarida bajarish va keyin natijalarni qo'llash uchun Proxy'dan foydalanish yaxshiroqdir.

Validatsiya uchun Proxies'dan foydalanishning afzalliklari

• Markazlashtirilgan Validatsiya Mantiqi: Proxies validatsiya mantiqini bir joyda markazlashtirish imkonini beradi, bu esa uni saqlash va yangilashni osonlashtiradi.
• Kodning O'qilishi Osonlashadi: Validatsiya mantiqini asosiy ob'ekt mantiqidan ajratish orqali siz kodingizning o'qilishini va boshqarilishini yaxshilashingiz mumkin.
• Kuchaytirilgan Tur Xavfsizligi: Proxies tur xavfsizligini ta'minlashga yordam beradi, noto'g'ri ma'lumot turlari sababli yuzaga keladigan xatolar xavfini kamaytiradi.
• Moslashuvchanlik va Sozlash: Proxies yuqori darajadagi moslashuvchanlikni ta'minlaydi, bu sizga ilovangizning o'ziga xos ehtiyojlarini qondirish uchun validatsiya qoidalarini sozlash imkonini beradi.

Proxies'dan foydalanishdagi Cheklovlar

• Ishlash Tezligiga Ta'sir: Ob'ekt operatsiyalarini tutib olish tufayli Proxies biroz ishlash tezligiga ta'sir qiladi. Bu ta'sir ko'pchilik ilovalar uchun odatda ahamiyatsiz, ammo ishlash tezligi muhim bo'lgan stsenariylarda uni hisobga olish kerak.
• Moslik: Proxies zamonaviy brauzerlar va Node.js'da qo'llab-quvvatlansa-da, eski muhitlarda qo'llab-quvvatlanmaydi. Eski brauzerlar bilan moslikni ta'minlash uchun sizga polyfill'lardan foydalanish kerak bo'lishi mumkin.
• Nosozliklarni Tuzatish: Ob'ekt operatsiyalarini tutib olish tufayli Proxies'dan foydalanadigan kodni nosozliklarni tuzatish biroz qiyinroq bo'lishi mumkin. Biroq, zamonaviy dasturchi vositalari Proxies'ni nosozliklarni tuzatish uchun yaxshi qo'llab-quvvatlaydi.

Proxy Handler Validatsiyasi uchun Eng Yaxshi Amaliyotlar

• Handlerlarni Oddiy Saqlang: Ishlash tezligiga ta'sirni minimallashtirish va o'qishni yaxshilash uchun Proxy handlerlari ichida murakkab mantiqdan saqlaning.
• Aniq Xato Xabarlarini Bering: Dasturchilarga validatsiya nima uchun muvaffaqiyatsiz bo'lganini tushunishga yordam beradigan ma'lumotli xato xabarlarini tashlang.
• Ishlash Tezligini Hisobga Oling: Proxies'ning ishlash tezligiga ta'sirini, ayniqsa ishlash tezligi muhim bo'lgan ilovalarda, yodda tuting.
• Ehtiyotkorlik bilan Foydalaning: Proxies'dan haddan tashqari ko'p foydalanmang. Ularni validatsiya va boshqa metadasturlash vazifalari uchun strategik ravishda, aniq foyda keltiradigan joylarda ishlating.
• Sinnchkovlik bilan Sinovdan O'tkazing: Proxy-ga asoslangan validatsiya mantiqingizni barcha stsenariylarda kutilganidek ishlashini ta'minlash uchun sinchkovlik bilan sinovdan o'tkazing.

Validatsiya uchun Global Mulohazalar

Global auditoriya uchun ilovalar ishlab chiqishda, validatsiya qoidalarini amalga oshirishda madaniy farqlar va mintaqaviy o'zgarishlarni hisobga olish muhimdir. Quyida ba'zi asosiy mulohazalar keltirilgan:

• Sana va Vaqt Formatlari: Turli hududlar uchun sana va vaqt formatlarini to'g'ri boshqarish uchun Moment.js yoki date-fns kabi kutubxonadan foydalaning. Masalan, Qo'shma Shtatlarda sanalar ko'pincha MM/DD/YYYY shaklida formatlanadi, Yevropada esa odatda DD/MM/YYYY shaklida.
• Raqam Formatlari: Turli raqam formatlaridan, shu jumladan o'nlik ajratuvchilar va minglik ajratuvchilardan xabardor bo'ling. Ba'zi mamlakatlarda vergul o'nlik ajratuvchi sifatida ishlatiladi, boshqalarida esa nuqta.
• Valyuta Formatlari: Valyuta qiymatlarini foydalanuvchining hududi uchun to'g'ri formatda ko'rsating, shu jumladan mos valyuta belgisi va o'nlik aniqlik bilan.
• Manzil Formatlari: Manzil formatlari butun dunyo bo'ylab sezilarli darajada farq qiladi. Xalqaro manzilni validatsiya qilish va formatlashni qo'llab-quvvatlaydigan kutubxona yoki API'dan foydalanishni ko'rib chiqing.
• Telefon Raqamlari Formatlari: Telefon raqamlari to'g'ri kiritilishini ta'minlash uchun xalqaro telefon raqamlarini validatsiya qilish va formatlashni qo'llab-quvvatlaydigan kutubxonadan foydalaning.
• Ism Formatlari: Ism formatlari turli madaniyatlarda farq qilishi mumkinligini yodda tuting. Ba'zi madaniyatlar berilgan ism, keyin familiyadan foydalanadi, boshqalari esa familiya, keyin berilgan ismdan. Shuningdek, ba'zi madaniyatlarda bir nechta berilgan ismlar yoki familiyalar mavjud.
• Belgilar Majmualari: Ilovangiz turli tillardagi ismlar, manzillar va boshqa matnli ma'lumotlarni joylashtirish uchun turli belgilar majmualari va kodlashlarni qo'llab-quvvatlashini ta'minlang.
• Madaniy Nozikliklar: Validatsiya qoidalarini ishlab chiqishda madaniy nozikliklarni yodda tuting. Masalan, ba'zi turdagi ma'lumotlar ba'zi madaniyatlarda shaxsiy yoki maxfiy hisoblanishi mumkin.

Misol: Xalqaro Telefon Raqamlarini Validatsiya qilish

            // "google-libphonenumber" kabi kutubxonadan foydalanayotganingizni hisobga olsak

import { parsePhoneNumberFromString, AsYouType } from 'google-libphonenumber';

function validatePhoneNumber(phoneNumber, countryCode) {
  try {
    const number = parsePhoneNumberFromString(phoneNumber, countryCode);
    if (number && number.isValid()) {
      return true;
    } else {
      return false;
    }
  } catch (error) {
    return false; // Noto'g'ri telefon raqami formati
  }
}

// Misol: Foydalanish (Germaniya)
const isValidGermanNumber = validatePhoneNumber('+4917612345678', 'DE');
console.log('Germaniya raqami to\'g\'rimi:', isValidGermanNumber); // Natija: true

// Misol: Foydalanish (Qo'shma Shtatlar)
const isValidUSNumber = validatePhoneNumber('+15551234567', 'US');
console.log('AQSh raqami to\'g\'rimi:', isValidUSNumber); // Natija: true

            

              
                Copy
              
            
          

Xulosa

JavaScript Proxies ilovalaringizda validatsiya mantiqini amalga oshirish uchun kuchli va moslashuvchan mexanizmni ta'minlaydi. Proxy handlerlaridan foydalanib, siz ob'ekt xususiyatlari, funksiya argumentlari va ob'ekt qurilishiga cheklovlar va tur xavfsizligini qo'llashingiz mumkin, bu esa mustahkamroq, boshqarilishi osonroq va xavfsizroq kodga olib keladi. Proxies'dan foydalanganda ishlash tezligiga ta'sir va moslik masalalarini hisobga olishni unutmang va har doim validatsiya mantiqingizni sinchkovlik bilan sinovdan o'tkazing. Ushbu blog postida keltirilgan eng yaxshi amaliyotlarga rioya qilib, siz JavaScript ilovalaringizning sifatini va ishonchliligini oshirish uchun Proxies'dan samarali foydalanishingiz, lokalizatsiya qilingan validatsiya strategiyalari bilan global auditoriyaga xizmat qilishingiz mumkin.